<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta card_input="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0">
    <link rel="stylesheet" type="text/css" href="css/bootStrap.css">
    <link rel="stylesheet" href="css/mpicker.css">
    <title>加盟天天充电,天天躺着挣钱</title>
    <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
    <style>
        * {
            margin: 0;
            padding: 0;
        }

        body {
            background-color: #F3F3F3;
        }

        .img {
            width: 100%;
            height: 25vh;
        }

        .card {
            width: 95%;
            border-radius: 15px;
            background-color: #fff;
            position: absolute;
            left: calc((100% - 95%) / 2);
            top: calc((100% - 55%) / 2);
            z-index: 2;
            display: flex;
            flex-direction: column;
            align-items: center;
            box-shadow: 0px 2px 15px 1px #dcdcdc;
        }

        .card>h4 {
            color: #F96841;
            margin: 3vh 0 1.5vh 0;
            letter-spacing: 1px;
        }

        .p1 {
            width: 45px;
            border-bottom: 1px solid #F96841;
            margin-bottom: 15px;
        }

        .p2 {
            font-size: 13px;
            margin-bottom: 20px;
        }

        .card_input {
            width: 90%;
            display: flex;
            justify-content: center;
            margin: 0 auto 25px auto;
        }

        .card_input>div {
            width: 30%;
            background: #F96841;
            text-align: center;
            color: #fff;
            letter-spacing: 2px;
            line-height: 30px;
        }

        .card_input>input {
            line-height: 30px;
            border: 1px solid #F96841;
            width: 60%;
        }

        .confirm {
            width: 85%;
            height: 30px;
            border-radius: 15px;
            background: #F96841;
            border: 0;
            color: #fff;
            margin-bottom: 30px;
        }
    </style>
</head>

<body>
    <div class="contain">
        <div class="head">
            <img class="img" src="./image/join.png"></img>
        </div>
        <div class="card">
            <h4>联系我们</h4>
            <p class="p1"></p>
            <p class="p2">请根据提示填写信息, 我们将在48小时内电话回复</p>
            <div class="card_input">
                <div>
                    <text>姓名</text>
                </div>
                <input type="text" id="name" class="name" placeholder="请输入姓名">
            </div>
            <div class="card_input">
                <div>
                    <text>电话</text>
                </div>
                <input type="text" id="phone" class="phone" placeholder="请输入电话">
            </div>
            <div class="card_input">
                <div>
                    <text>任意区域</text>
                </div>
                <input type="text" id="area" class="area" value="陕西省-西安市">
            </div>
            <button class="confirm">确认</button>
        </div>
    </div>
</body>
<script src="js/jquery-3.5.1.min.js"></script>
<script src="js/json.js"></script>
<script src="js/jsonExchange.js"></script>
<script src="js/mPicker.min.js"></script>
<script>
    $(document).ready(function () {
        let u = navigator.userAgent
        let user_id = getUrldata('Uid')
        // 判断ios
        let is_ios = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)
        // 判断android
        let is_android = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1
        //判断微信
        function isWeiXin() {
            var ua = window.navigator.userAgent.toLowerCase();
            if (ua.match(/MicroMessenger/i) == 'micromessenger') {
                return true; // 是微信端
            } else {
                return false;
            }
        }

        $.ajax({
            type: 'POST',
            url: 'https://api.cd1a.cn/index.php/activity/attract/user_data',
            data: {
                userid_locked: user_id
            },
            dataType: 'json',
            async: true,
            success: function (res) {
                console.log(res)
                if (res.data) {
                    $('#name').val(res.data.name)
                    $('#phone').val(res.data.phone)
                    $('#area').val(res.data.province + '-' + res.data.city)
                    $('.confirm').attr("disabled",true);
                }
            }
        })

        function mobile() {
            if (isWeiXin()) {
                (() => {
                    window.alert = function (name) {
                        var iframe = document.createElement("IFRAME");
                        iframe.style.display = "none";
                        iframe.setAttribute("src", 'data:text/plain');
                        document.documentElement.appendChild(iframe);
                        window.frames[0].window.alert(name);
                        iframe.parentNode.removeChild(iframe);
                    }
                })()
                alert('电话有误,请重新输入')
                return
            } else if (is_ios) {
                window.webkit.messageHandlers.showAlert.postMessage('电话有误,请重新输入')
                return
            } else if (is_android) {
                window.TiantianCharge_Android.showAlert('电话有误,请重新输入')
                return
            }
        }

        function content() {
            if (isWeiXin()) {
                (() => {
                    window.alert = function (name) {
                        var iframe = document.createElement("IFRAME");
                        iframe.style.display = "none";
                        iframe.setAttribute("src", 'data:text/plain');
                        document.documentElement.appendChild(iframe);
                        window.frames[0].window.alert(name);
                        iframe.parentNode.removeChild(iframe);
                    }
                })()
                alert('请输入内容')
                return
            } else if (is_ios) {
                window.webkit.messageHandlers.showAlert.postMessage('请输入内容')
                return
            } else if (is_android) {
                window.TiantianCharge_Android.showAlert('请输入内容')
                return
            }
        }

        function success() {
            if (isWeiXin()) {
                // 判断小程序的环境
                if (window.__wxjs_environment === 'miniprogram') {
                    wx.miniProgram.navigateBack({
                        delta: 1
                    })
                }
                return
            } else if (is_ios) {
                window.webkit.messageHandlers.showAlert.postMessage('录入成功')
                return
            } else if (is_android) {
                window.TiantianCharge_Android.showAlert('录入成功')
                return
            }
        }

        // 切割区域
        function reg (zone) {
            let zone_arr = zone.split('-')
            return zone_arr
        }

        $('.area').mPicker({
            level: 2,
            dataJson: dataJson,
            Linkage: true,
            rows: 6,
            idDefault: true,
            splitStr: '-',
            header: '<div class="mPicker-header">两级联动选择插件</div>',
            confirm: function (json) {
                console.info(json)
                $('#area').val(json.name)
            },
            cancel: function (json) {
            }
        })

        $('.confirm').click(function () {
            let name = $('#name').val()
            let phone = $('#phone').val()
            let area = $('#area').val()
            let area_arr = reg(area)
            if (name == '' || phone == '') {
                content()
            } else if (/^1[3456789]\d{9}$/.test(phone) == false) {
                mobile()
            } else {
                $.ajax({
                    type: 'POST',
                    data: {
                        userid_locked: user_id,
                        name: name,
                        phone: phone,
                        province: area_arr[0],
                        city: area_arr[1]
                    },
                    url: 'https://api.cd1a.cn/index.php/activity/attract/attract_investment',
                    dataType: 'json',
                    async: true,
                    success: function (res) {
                        console.log(res)
                        if(res.result_code == 200) {
                            $('.confirm').attr("disabled",true);
                            success()
                        }
                    }
                })
            }
        })

        // 获取用户id
        function getUrldata(name) {
			var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)")
			var r = window.location.search.substr(1).match(reg)
			if (r != null) return decodeURI(r[2])
			return null
		}
    })
</script>

</html>